<template>
	<scroll-view class="purchaseRecord">
			<block v-for="(item,index) of record_line_list" :key='index'>
				<view class="recordHead">
					<image src="../../static/rear/record.png" mode="aspectFit" style="height: 64rpx; width: 64rpx;"></image>
					<view>
						<text>{{item.monitoring_time}}</text>
					</view>
					<view>
						<text>{{item.title_span}}</text>
					</view>
				</view>
				<view class="recordFooter">
					<text class="line"></text>
					<view class="recordContent">
						<view class="recordContentLeft">
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots1.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>水体异味：{{item.water_peculiar_smell}}</text>
							</view>
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots2.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>气温：{{item.air_temperature}}℃</text>
							</view>
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots2.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>水温：{{item.water_temperature}}℃</text>
							</view>
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots3.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>水体混浊度：{{item.water_turbidity}}</text>
							</view>
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots3.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>空气湿度：{{item.air_humidity}}%rh</text>
							</view>
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots3.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>空气有无异味：{{item.air_odor}}</text>
							</view>
							<view style="display: flex; flex-wrap: wrap;">
								<image src="../../static/rear/enviroment/Dots3.png" style="height: 58rpx; width: 58rpx;" mode="aspectFit"></image>
								<text>空气污染程度：{{item.air_pollution_degree}}</text>
							</view>
						</view>
						<!-- <view class="recordContentRight">
							<image src="../../static/rear/enviroment/atmosphere2.png" mode="aspectFit" style="height: 180rpx; width: 180rpx; margin-top: 120rpx;"></image>
						</view> -->
					</view>
				</view>
			</block>
	</scroll-view>
</template>

<script>
	//import xwEmpty from '../xw-empty/xw-empty.vue';
	export default {
		data() {
			return {
				
			}
		},
		components: {
			//xwEmpty
		},
		props: {
			record_line_list: {
				type: Array
			}
		}
	}
</script>

<style lang="less">
	.purchaseRecord {
		margin-top: 30rpx;
	}

	.recordHead {
		width: 750rpx;
		display: flex;
		flex-wrap: wrap;
	}

	.recordHead>image {
		margin-left: 20rpx;
	}

	.recordHead>view>text {
		margin-left: 20rpx;
		font-size: 32rpx;
		height: 64rpx;
		line-height: 64rpx;
	}

	.recordFooter {
		display: flex;
		flex-wrap: wrap;
		width: 750rpx;
		height: 440rpx;
	}

	.line {
		width: 2rpx;
		height: 440rpx;
		border-left: #07D188 solid 2px;
		margin-left: 46rpx;
		word-break: break-all;
	}

	.recordContent {
		display: flex;
		flex-wrap: wrap;
		width: 600rpx;
		height: 400rpx;
		background: white;
		margin-top: 20rpx;
		margin-left: 20rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		border-radius: 40rpx;
		font-size: 36rpx;
		box-shadow: 0rpx 0rpx 10rpx 5rpx #E6E6E6;
	}
	
	.recordContentLeft {
		display: flex;
		flex-direction: column;
		justify-content: center;
		width: 400rpx;
		height: 400rpx;
		font-size: 28rpx;
	}
	
	.recordContentLeft>view>text {
		margin-top: 10rpx;
	}
	
	.recordContentRight {
		width: 200rpx;
		height: 400rpx;
	}
</style>
